/* eslint-disable react/no-array-index-key */
/**
 * 人才简历主要信息
 */
import React from 'react';
import { Avatar, Icon, Tag } from 'antd';
import cn from 'classnames';
import styles from './index.less';

const MajorInfoCard = props => {
    const { star, avatar, name, description, education, company, tags = [], applyNum, hasBlackList } = props;
    return (
        <div>
            <div className={cn(styles.box, styles.flexWrap)}>
                <div className={cn(styles.star, styles.flexNone, { [styles.transparent]: !star })}></div>
                <div className={cn(styles.flexNone, styles.box)}>
                    <Avatar
                        style={{ background: 'rgba(248, 249, 248)' }}
                        icon={<Icon type="user" style={{ color: 'rgba(0, 0, 0, 0.25)' }}></Icon>}
                        size={32}
                        src={avatar}
                    />
                    <span className={styles.title}>{name}</span>
                </div>
                <div className={cn(styles.box, styles.flexNone, styles.description, styles.mr16)}>
                    {description.map((item, index) => (
                        <React.Fragment key={index}>
                            <div>{item}</div>
                            {index !== description.length - 1 && (
                                <div className={cn(styles.split, styles.primarySplit)}></div>
                            )}
                        </React.Fragment>
                    ))}
                    {
                        applyNum
                            ? <Tag className={styles.ml16} color="blue">{`应聘中${applyNum > 1 ? `(${applyNum})` : ''}`}</Tag>
                            : null
                    }
                    {
                        hasBlackList && (
                        <Tag color="black" style={{ marginLeft: 8 }}>
                            黑名单
                        </Tag>
                    )}
                </div>
            </div>
            <div className={cn(styles.box, styles.ml16, styles.mt12, styles.flexWrap)}>
                <div className={styles.iconWrapper}>
                    <i className={cn('icon', 'iconfont', 'iconlist_work_icon_default1', styles.mr15)}></i>
                </div>

                {company.map((item, index) => (
                    <React.Fragment key={index}>
                        <div>{item}</div>
                        {index !== company.length - 1 && (
                            <div className={cn(styles.split, styles.secondarySplit)}></div>
                        )}
                    </React.Fragment>
                ))}
            </div>
            <div className={cn(styles.box, styles.ml16, styles.mt10, styles.flexWrap)}>
                <div className={styles.iconWrapper}>
                    <i className={cn('icon', 'iconfont', 'iconlist_school_icon_default1', styles.mr15)}></i>
                </div>

                {education.map((item, index) => (
                    <React.Fragment key={index}>
                        <div>{item}</div>
                        {index !== education.length - 1 && (
                            <div className={cn(styles.split, styles.secondarySplit)}></div>
                        )}
                    </React.Fragment>
                ))}
            </div>
            <div className={cn(styles.box, styles.ml16, styles.flexWrap)}>
                {tags.map((item, index) => (
                    <Tag className={styles.mt10} key={index} color={item.color}>
                        {item.name}
                    </Tag>
                ))}
            </div>
        </div>
    );
};
export default MajorInfoCard;
